{extend name='common/common' /}

{block name="content"}
<el-card class="box-card">
	<div slot="header">
		<span class="span-primary"><i class="fa fa-file"></i></span>
		文件列表
		{if authCheck('filedownload/delfile')}
		<el-button class="header-btn" type="danger" size="small"
			icon="fa fa-trash" plain @click="delRow"> 删除文件</el-button>
		{/if}
		{if authCheck('filedownload/topfile')}
		<el-button class="header-btn" type="warning" size="small"
			icon="el-icon-upload2" plain  @click="topRow"> 置顶 / 取消</el-button>
		{/if}
		{if authCheck('filedownload/pubfile')}
		<el-button class="header-btn" type="success" size="small"
			icon="el-icon-sold-out" plain  @click="pubRow"> 发布 / 取消</el-button>
		{/if}
		{if authCheck('filedownload/addfile')}
		<a href="./addFile">
			<el-button class="header-btn" type="primary" size="small"
				icon="el-icon-plus" plain>添加文件</el-button>
		</a>
		{/if}
	</div>
	<el-table :data="fileTable.tableData" stripe="true" border @selection-change="getIds">
		<el-table-column align="center" type="selection" width="50"></el-table-column>
		<el-table-column align="center" prop="id" label="ID" width="50"></el-table-column>
		<el-table-column align="left" label="文件重点名称">
			<template slot-scope="scope">
				{{scope.row.name}}<span class="span-danger">{{scope.row.important}}</span>
			</template>
		</el-table-column>
		<el-table-column align="left" prop="url" label="下载链接"></el-table-column>
		<el-table-column align="center" prop="is_publish" label="发布状态" width="80">
			<template slot-scope="scope">
				<el-tag
					:type="scope.row.is_publish == '1' ? 'primary' : 'info'">
					{{scope.row.is_publish_name}}
				</el-tag>
      		</template>
		</el-table-column>
		<el-table-column align="center" prop="is_top" label="置顶状态" width="80">
			<template slot-scope="scope">
				<el-tag
					:type="scope.row.is_top == '0' ? 'success' : 'info'">
					{{scope.row.is_top_name}}
				</el-tag>
      		</template>
		</el-table-column>
		<el-table-column align="center" prop="publish_time_name" label="发布时间" width="150">
		</el-table-column>
	</el-table>
	<div class="table-page">
		<el-pagination
			@size-change="pageSizeChange"
			@current-change="curPageChange"
			:current-page="fileTable.pageNumber"
			:page-sizes="[10, 20, 50, 75]"
			:page-size="fileTable.pageSize"
			layout="total, sizes, prev, pager, next, jumper"
			:total="fileTable.tableTotal">
		</el-pagination>
	</div>
</el-card>
{/block}

{block name="script"}
<script type="text/javascript">
var main = new Vue({
	el:"#main",
	data:{
		loading:false,
		Ids:"",
		fileTable:{
			tableData:"",
			pageSize:10,
			pageNumber:1,
			tableTotal:0,
		}
	},
	mounted:function (){
		this.getTable();
	},
	methods:{
		getTable() {
			this.loading=true;
			$.post('{:url("Filedownload/index")}',{
				'pageSize':this.fileTable.pageSize,
				'pageNumber':this.fileTable.pageNumber,
			},function(res){
				main.loading=false;
				if(res.code == 1){
					main.$message({message: res.msg,type: 'success'});
					main.fileTable.tableData = res.data.rows;
					main.fileTable.tableTotal = res.data.total;
				}else{
					main.$notify.error({title: '失败',message: res.msg});
				}
			})
		},
		pageSizeChange(val) {
			this.fileTable.pageSize = val;
			this.getTable();
		},
		curPageChange(val) {
			this.fileTable.pageNumber = val;
			this.getTable();
		},
		getIds(val){
			this.Ids = val;
		},
		delRow() {
			var ids = this.checkIds();
			this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'
			}).then(() => {
				this.ajaxPost("./delFile",ids);
			}).catch(() => {
				this.$notify.info({title:'消息',message:'已取消删除'});
			});
		},
		pubRow() {
			var ids = this.checkIds();
			this.ajaxPost("./pubFile",ids);
		},
		topRow() {
			var ids = this.checkIds();
			this.ajaxPost("./topFile",ids);
		},
		checkIds() {
			var ids = [];
			for(var i=0;i<this.Ids.length;i++){
				ids.push(this.Ids[i].id);
			}
			if(ids.length == 0){
				this.$notify.error({title:"错误",message:"请选择要操作的数据"});
				return false;
			}else{
				return ids;
			}
		},
		ajaxPost(url,ids){
			if(!ids){
				return false;
			}
			$.post(url,{'param':ids},function(res){
				if(res.code == '1'){
					main.$notify({title:"成功",type:"success",message:res.msg});
					main.getTable();
				}else{
					main.$notify.error({title:"错误",message:res.msg})
				}
			})
		}
	}
})
</script>
{/block}
